<template>
	<view class="wanl-money">
		<view class="edgeInsetTop"></view>
		<view class="cu-list menu-avatar" v-if="dataList">
			<view class="cu-item" style="height: 100rpx;color:cadetblue;font-weight: 600;">
				<view class=""></view>
				<view class="content" style="left: 20rpx;">
					附近门店
				</view>	
			</view>
			<view class="list" v-for="(item, index) in dataList" :key="item.id"  >
				<view class="img-wrap l">
					<image class="image" :src="$wanlshop.oss(item.image)"></image>
				</view>		
			
				<view class="list-content l">
					<view class="text-sm flex">			
						<view class="name wanl-black text-lg text-cut-2">
							<view class="cu-tag radius margin-right-xs sm bg-red">{{item.type == 2?'社区服务商':'股东经销商'}}</view>
							{{item.store}}
						</view> 
					</view>
					<view class="product" @tap="showsheet">
						<view class="t cu-tag radius sm line-red">自提产品-服务中</view>
						<view class="c">大江大河（白瓶）,大江大河（蓝瓶）<view class="txt">(查看详情)</view></view>						
					</view>						
					
					
												
				</view>
				<button class="cu-btn bg-gradual-orange round text-bold complete" @tap="$wanlshop.auth(`/pages/user2/preOrder/preOrder?id=${item.id}`)">预订</button>
				<view class="action l" style="font-size: 20rpx;" @tap="$wanlshop.auth(`/pages/user/takeGoods/takeGoods?id=${item.id}`)">
					<text class="wlIcon-weizhi" style="color: red;font-size: 25rpx;"></text>{{item.distance}}公里
				</view>
			</view>
		</view>
		<!-- 空 -->
		<view v-if="dataList.length == 0">
			<wanl-empty src="ticket_default3x" text="没有找到任何门店"/>
		</view>
		<view class="edgeInsetBottom"></view>
		<uni-load-more :status="status" :content-text="contentText" />
	</view>
</template>

<script>
export default {
	data() {
		return {
			longitude:'',
			latitude:'',
			dataList: [],
			type: {
				0: '否',
				1: '是'
			},
			reload: false, //判断是否上拉
			total: 0, //数据量
			current_page: 1, //当前页码
			last_page: 1, //总页码
			status: 'more',
			contentText: {
				contentdown: ' ',
				contentrefresh: '加载中',
				contentnomore: ''
			}
		};
	},
	onLoad(option) {
		
		//   wx请求获取位置权限
		this.getAuthorize().then(() => {
				//   同意后获取				
			this.getLocationInfo();
		}).catch(() => {
			//   不同意给出弹框，再次确认
			// this.openConfirm().then(() => {
			// 	this.getLocationInfo();
			// }).catch(() => {
			// 	this.rejectGetLocation();
			// });
			this.getLocationInfo();
		});
		this.loadData();
		
	},
	onPullDownRefresh() {
		this.current_page = 1;
		this.reload = true;
		this.loadData();
	},
	onReachBottom() {
		//判断是否最后一页
		if (this.current_page >= this.last_page) {
			this.status = 'noMore';
		} else {
			this.reload = false;
			this.current_page = this.current_page + 1; //页码+1
			this.status = 'loading';
			this.loadData();
		}
	},
	methods: {
		//   初次位置授权
		getAuthorize() {
			console.log(11);
			return new Promise((resolve, reject) => {
				uni.authorize({
					scope: "scope.userLocation",
					success: () => {
						resolve(); // 允许授权
					},
					fail: () => {
						reject(); // 拒绝授权
					},
				});
			});
		},
		// 确认授权后，获取用户位置
		getLocationInfo() {
			let that = this;
			uni.getLocation({
				type: "gcj02",
				success: function(res) {
					console.log(res);
					that.longitude = res.longitude; 
					that.latitude = res.latitude;	
					let data = {
							page: that.current_page,
							lat:that.latitude,
							lon:that.longitude
						};					
					uni.request({
						url: '/wanlshop/ddporder/getPartnerShop',
						method: 'POST',
						data: data,
						success: res => {						
							that.dataList = res.data.data; //数据 追加						
						}
					});
				},
			});
		},
		// 拒绝授权后，弹框提示是否手动打开位置授权
		openConfirm() {
			return new Promise((resolve, reject) => {
				// uni.showModal({
				// 	title: "请求授权当前位置",
				// 	content: "我们需要获取地理位置信息，请手动设置位置权限",
				// 	success: (res) => {
				// 		if (res.confirm) {
				// 			// #ifdef MP-WEIXIN 
				// 			uni.openSetting().then((res) => {
				// 				if (res[1].authSetting["scope.userLocation"] === true) {
				// 					resolve(); // 打开地图权限设置
				// 				} else {
				// 					reject();
				// 				}
				// 			});							
				// 			// #endif
				// 			// #ifndef MP-WEIXIN 
				// 			resolve();
				// 			// #endif
				// 		} else if (res.cancel) {
				// 			reject();
				// 		}
				// 	},
				// });
					resolve();
			});
		},
		// 彻底拒绝位置获取
		rejectGetLocation() {
			uni.showToast({
				title: "您拒绝了授权，无法获得周边信息",
				icon: "none",
				duration: 2000,
			});
		},
		loadData(type) {
			let data = {
					page: this.current_page,
					lat:this.latitude,
					lon:this.longitude
				};
			if(type)data.type = type;
			uni.request({
				url: '/wanlshop/ddporder/getPartnerShop',
				method: 'POST',
				data: data,
				success: res => {
					console.log(res);
					uni.stopPullDownRefresh();
					this.dataList = this.reload ? res.data.data : this.dataList.concat(res.data.data); //数据 追加
					this.total = res.data.total; //数据量
					//this.current_page = res.data.current_page; //当前页码
					//this.last_page = res.data.last_page; //总页码
					this.status = res.data.total == 0 ? 'noMore' : 'more';
				}
			});
		},
		showsheet() {
				  uni.showActionSheet({
					itemColor: "#FE6800", 
					itemList: [
						'大江大河（白瓶）', 
						'大江大河（蓝瓶）'
					],
					success: (res) => {						  
						this.$wanlshop.auth('/pages/product/goods?id='+(res.tapIndex+3));
					},
					fail: (err) => {
					  console.log('弹窗取消');
					}
				  });
				},
		
	}
};
</script>

<style>
.wanl-money .balance {
	margin: 10rpx 25rpx 25rpx 25rpx;
}

.wanl-money .balance .details {
	padding: 50rpx 0;
}

.wanl-money .balance .operate {
	display: flex;
	align-items: center;
	justify-content: space-around;
	background: rgba(0, 0, 0, 0.1);
	height: 80rpx;
	color: #fff;
}
.list{
	height: 300rpx;
	padding: 10rpx;
	position: relative;
}
.list .l{
	float: left;margin-right: 15rpx;
}

.list .l .image{
	width: 250rpx;
	height: 250rpx;
}
.list .action{
	position: absolute;
	top: 0;
	right: 10rpx;
}
.list-content .text-sm .text-cut{
	color: red;
	font-size: 30rpx;
}
.list-content .product{
	margin: 20rpx 0;	
}


.list-content .product .c{
	font-size: 25rpx;
	margin-left: 10rpx;
}

.list-content .product .c .txt{
	color: red;font-size: 23rpx;
	font-weight: 600;
}


.list .cu-btn{
	height: 50rpx;
	position: absolute;
	bottom: 50rpx;
	right: 30rpx;
}
</style>

